<template>
	<div class="common-layout article">
		<el-container>
			<el-header>
				<div class="right">
					<el-icon title="跳转后台" @click="articleClass.toWeb()"><Monitor /></el-icon>
					<el-button type="primary" @click="articleClass.logout()">退出登录</el-button>
				</div>
			</el-header>
			<el-main>
				<el-row class="details">
					<div>
						<h2>{{ articleClass.articleInfo?.value?.title }}</h2>
						<div>
							<span class="admin">{{ articleClass.articleInfo?.value?.username }}</span>
							<span class="createdAt">{{ articleClass.articleInfo?.value?.createdAt.slice(0, 10) }}</span>
							<span>{{ articleClass.articleInfo?.value?.type }}</span>
							<span class="tag">{{ articleClass.articleInfo?.value?.tag }}</span>
						</div>
						<div v-html="articleClass.articleInfo?.value?.content" />
					</div>
				</el-row>
				<el-row>
					<!-- 个人信息 -->
					<info />
				</el-row>
			</el-main>
		</el-container>
	</div>
</template>
<script lang="ts" setup>
import { Monitor } from '@element-plus/icons-vue'
import info from '@/view/stage/info/index.vue'
import { ArticleClass } from './controller'
let articleClass = new ArticleClass()
</script>
<style lang="scss" src="./index.scss"></style>
